Estoy creando una aplicación en React que usa Firebase para datos de back-end y quiero poder cargar imágenes. Cuando intento obtener una referencia de almacenamiento a través de firebase, aparece el siguiente error:
Cada vez que intento obtener una referencia para el almacenamiento, aparece este error. También uso la base de datos en tiempo real en firebase, pero no creo que eso interfiera en absoluto. A continuación se muestra el código que se llama:
import database, { auth, provider, storage } from '../../components/utils/firebase.js'; import { uploadBytes } from '@firebase/storage'; ... handleSubmit(e) { e.preventDefault(); const file = e.target[0].files[0]; console.log("File: ", file); if (!file) { console.log("No file!"); } else { const storageRef = ref(storage, `images/${file.name}`); uploadBytes(storageRef, file); console.log("Uploaded file!"); console.log("File: " + file); } }firebase.js (mi archivo de configuración):
import { initializeApp } from 'firebase/app'; import { getDatabase } from 'firebase/database'; import { getAuth, GoogleAuthProvider } from 'firebase/auth'; import { getStorage } from 'firebase/storage'; const firebaseConfig = { apiKey: process.env.REACT_APP_APIKEY, authDomain: process.env.REACT_APP_AUTHDOMAIN, databaseURL: process.env.REACT_APP_DATABASEURL, projectId: process.env.REACT_APP_PROJECTID, storageBucket: process.env.REACT_APP_STORAGEBUCKET, messagingSenderId: process.env.REACT_APP_MESSAGINGSENDERID, appId: process.env.REACT_APP_APPID, measurementId: process.env.REACT_APP_MEASUREMENTID }; // Initialize Firebase const app = initializeApp(firebaseConfig); const database = getDatabase(app); export const storage = getStorage(app); export default database; export const auth = getAuth(app); export const provider = new GoogleAuthProvider();¿Alguien tiene alguna idea de por qué sucede esto? ¡Gracias!
Encontré el problema mientras miraba un video de alguien configurando su cubo de almacenamiento.
Esencialmente, debido a que ya estoy usando ref para mi base de datos en tiempo real e importo ese comando desde la carpeta de la base de datos en tiempo real, mi referencia de almacenamiento era en realidad una referencia de base de datos en tiempo real. Para solucionar esto, importé mi función de ref de almacenamiento de la siguiente manera:
import { ref as sRef } from 'firebase/storage';
luego usó sRef en lugar de ref .
¡Espero que esto ayude a cualquiera que haya tenido el mismo problema! Fue frustrante cazar